<template>
  <div>
    <el-dialog
      title="文件任务信息"
      :close-on-click-modal="false"
      :visible.sync="databaseFormVisible"
      :before-close="handelCancel"
      width="40%"
    >
      <el-scrollbar style="height: 100%">
        <znxd-form
          ref="form"
          v-model="formData"
          v-if="databaseFormVisible"
          :formColumn="formColumn"
          :formRules="formRules"
          :initData="initData"
          :formButtons="formButtons"
          @handeSave="handeSave"
          @handelCancel="handelCancel"
        ></znxd-form>
      </el-scrollbar>
    </el-dialog>
  </div>
</template>
<script>
import { add, update } from "@/api/task/fileserver.js"
export default {
  components: {},
  data () {
    return {
      // // 类型字典
      // typeOptions: [
      //   {
      //     label: "接口数据采集",
      //     value: 0
      //   }
      // ],
      // 表单配置
      formColumn: [],
      formRules: {
        jobName: [{ required: true, message: "不能为空" }],
        jobType: [{ required: true, message: "不能为空" }]
      },
      formData: {},
      formButtons: [
        {
          label: "保存",
          type: "primary",
          handelClick: (row) => {
            this.handeSave(row)
          }
        },
        {
          label: "取消",
          plain: true,
          handelClick: () => {
            this.handelCancel()
          }
        }
      ]
    }
  },
  props: {
    databaseFormVisible: Boolean,
    initData: Object
  },
  watch: {
    initData (val) {
      // console.log(this.initData);
      this.formData = {
        ...val
      }
    }
    // formData: {
    //   deep: true,
    //   handler: function (val) {
    //     console.log("formData", val);
    //   }
    // }
  },
  methods: {
    initForm () {
      this.formColumn = [
        {
          name: "jobName",
          label: "任务名称",
          type: "input"
        },
        // {
        //   name: "jobType",
        //   label: "任务类型",
        //   type: "select",
        //   options: this.typeOptions
        // },
        {
          name: "jobDescribe",
          // name: "jobDescription",
          label: "任务描述",
          type: "textarea"
        }
      ]
    },
    handeSave (formData) {
      let well = this.$refs.form.validateForm()
      if (!well) return false
      // console.log("handle formData", formData);
      let saveEvent
      if (this.initData && this.initData.id) {
        saveEvent = update
      } else {
        saveEvent = add
      }
      saveEvent(formData)
        .then((res) => {
          console.log(res, 6666666)
          let data = res.data
          if (data.code === 200) {
            this.$message({
              message: data.msg || "操作成功",
              type: "success"
            })
            this.handelCancel()
          } else {
            // this.$message.error(data.msg);
            this.$message({
              message: data.msg,
              type: "error"
            })
          }
        })
        .catch(() => {
          // this.$message.error(error);
          this.$message({
            message: "操作失败",
            type: "error"
          })
        })
    },
    handelCancel () {
      this.$emit("close")
    }
  },
  mounted () {
    this.formData = {
      ...this.initData
    }
    this.initForm()
  }
};
</script>
<style lang="scss" scoped>
</style>
